<template>
  <div>
    <div class="dingdan">
      <van-icon name="arrow-left" @click="$router.push(`/selectaddress`)" />
      <span>修改</span>
      <span></span>
    </div>
    <van-address-edit
      show-delete
      :show-area="false"
      show-set-default
      show-search-result
      :search-result="searchResult"
      @save="onSave"
      @delete="onDelete"
      @change-detail="onChangeDetail"
    />
  </div>
</template>

<script>
import { pois } from "../api/citylist";
import { Toast } from "vant";
export default {
  data() {
    return {
      //
      searchResult: [],
      a: localStorage.getItem("dizhi1")
        ? JSON.parse(localStorage.getItem("dizhi1")).length + 1
        : 1,
      array: localStorage.getItem("dizhi1")
        ? JSON.parse(localStorage.getItem("dizhi1"))
        : [],
      time: "time",
    };
  },
  created() {
    console.log();
  },
  methods: {
    onSave(content) {
      Toast("新增成功");
      console.log(content);
      this.a++;
      this.array.push({
        id: this.a,
        name: content.name,
        tel: content.tel,
        address: content.addressDetail,
      });
      console.log(50, this.array);
      console.log(51, JSON.stringify(this.array));
      localStorage.setItem("dizhi1", JSON.stringify(this.array));
      this.$router.push(`./selectaddress`);
    },
    onDelete() {
      Toast("delete");
    },
    onChangeDetail(val) {
      clearTimeout(this.time);
      console.log(val);
      this.time = setTimeout(() => {
        if (val) {
          pois().then((res) => {
            pois(4, val).then((res) => {
              console.log(60, res);
              this.searchResult = res.data;
            });
          });
          if (val == "") {
            this.searchResult = [];
          }
        } else {
          this.searchResult = [];
        }
      }, 150);
    },
  },
};
</script>
<style lang="less" scoped>
.dingdan {
  height: 60px;
  background-color: #3190e8;
  display: flex;
  line-height: 60px;
  justify-content: space-between;
  padding: 0 15px;
  .van-icon {
    margin-top: 15px;
  }
  span,
  .van-icon {
    font-size: 25px;
    color: cornsilk;
  }
}
</style>